import Qt 4.7



Rectangle {

    ListModel {
	id : lModel
	
	ListElement {
	    name: "retour"
	    icon:"images/retour.png"
	}

	ListElement {
	    name: "stop"
	    icon:"images/stop.png"
	}

	ListElement {
	    name: "play"
	    icon:"images/play.png"
	}
	  
	/*ListElement {
	    name: "play_pause"
	    icon:"images/pause.png"
	}*/

	ListElement {
	    name: "forward"
	    icon:"images/forward.png"
	}

	  
      }

    id: window
    color: "#3E606F"
    width: 680 
    height: 200
    ListView {
	    id: list1
	    anchors.centerIn: window
	    orientation:ListView.Horizontal
	    focus: true
            model:lModel
	    anchors.fill: parent
	    anchors.topMargin : 40
	    anchors.leftMargin : 80
	    spacing:30
	    delegate: Image {
			  id:img
			  source: icon
			  smooth: true
			  width:  100 ; height: 100
			  scale: 1
			  states: State {
			      name: "active"; when: activeFocus
			      PropertyChanges { target: img ; scale: 1.5 }
			  }

			  transitions: Transition {
			      NumberAnimation { properties: "scale"; duration: 300 }
			  }
		  }
	    
	    Keys.onPressed: {
		if (event.key == Qt.Key_Return) {
		    console.log("selected ############:"  + currentIndex );
		    event.accepted = true;
		}
	    }
	}

    

}

/*
    Rectangle {
        id: content
        //anchors.centerIn: parent
	//anchors.margins: 30
        smooth: true
        radius: 10
	color: "transparent"
	width: 400 
	height: 150
        //Rectangle { anchors.fill: parent; anchors.margins: 3; color: "#91AA9D"; smooth: true; radius: 8 }

        Image {
		focus : true
		id:play
		source: "images/play.png"
		smooth: true
		width: activeFocus? 150 : 100 ; height:activeFocus? 150 : 100
		anchors.verticalCenter: content.verticalCenter
		anchors.left:content.left
      
	      }

	Image {
		id:stop
		source: "images/stop.png"
		smooth: true
		width: activeFocus? 150 : 100 ; height:activeFocus? 150 : 100
		anchors.verticalCenter: content.verticalCenter
		anchors.left:play.right
		anchors.leftMargin : 20
	      
	      }

    }


    MouseArea {
        id: mouseArea
        anchors.fill: parent
        hoverEnabled: true

        onClicked: {
            ListView.view.currentIndex = index
            container.forceActiveFocus()
        }
    }

    Keys.onPressed: {
	  if (event.key == Qt.Key_Return) {
	      console.log("selected :"  + icone );
	      event.accepted = true;
	  }
    }
}
 */
